<template>
  <a-form layout="inline">
    <a-form-item label="库区">
      <a-select v-model="form.Areaid" class="slect-width" @change="onAreaChange">
        <a-select-option v-for="(item,index) in selectList.areas" :key="'area-sel-'+index" :value="item.id">{{item.areaName}}</a-select-option>
      </a-select>
    </a-form-item>
    <a-form-item label="巷道">
      <a-select v-model="form.Aisleid" allowClear class="slect-width" @change="onAisleChange">
        <a-select-option v-for="(item,index) in selectList.aisles" :key="'aisle-sel-'+index" :value="item">{{item}}</a-select-option>
      </a-select>
    </a-form-item>
    <a-form-item label="排">
      <a-select v-model="form.Rowno" allowClear class="slect-width">
        <a-select-option v-for="(item,index) in selectList.rows" :key="'row-sel-'+index" :value="item">{{item}}</a-select-option>
      </a-select>
    </a-form-item>
    <a-form-item>
      <a-button type="primary" @click.stop="onSearch">查询</a-button>
    </a-form-item>
  </a-form>
</template>

<script>
import { GetArea, GetAisle, GetPalceRowno } from '@/api/modular/main/FoamingLocationViewManage'
export default {
  name:'wmsWarehouseLocationViewSearchCompontent',
  emits:['update:loading','search'],
  data(){
    return {
      loading:{
        type:Boolean,
        default:false
      },
      form:{
        Areaid:null,
        Aisleid:null,
        Rowno:null
      },
      selectList:{
        areas:[],
        aisles:[],
        rows:[]
      }
    }
  },
  methods:{
    init(callback){
      this.getSelectListAreas((f1)=>{
        if (f1) {
          callback && callback(true,{...this.form})
        } else {
          callback && callback(false)
        }
      })
    },
    getSelectListAreas(callback){
      GetArea().then((d)=>{
        this.selectList.areas = d.data || [];
        this.selectList.rows = []
        this.form.Aisleid = null
        this.form.Rowno = null
        if (this.selectList.areas.length>0) {
          this.form.Areaid = this.selectList.areas[0].id
          this.getSelectListAisles(()=>{
            callback && callback(true)
          })
        } else {
          this.form.Areaid = null
          this.selectList.aisles = []
          callback && callback(true)
        }
      }).catch(()=>{
        this.selectList.areas = []
        this.selectList.aisles = []
        this.selectList.rows = []
        this.form.Areaid = null
        this.form.Aisleid = null
        this.form.Rowno = null
        callback && callback(false)
      })
    },
    getSelectListAisles(callback){
      let params = {Areaid:this.form.Areaid}
      GetAisle(params).then((d)=>{
        this.selectList.aisles = d.data || [];
        this.form.Rowno = null
        if (this.selectList.aisles.length===1) {
          this.form.Aisleid = this.selectList.aisles[0]
          this.getSelectListRows(()=>{
            callback && callback(true)
          })
        } else {
          this.selectList.rows = []
          this.form.Aisleid = null
          callback && callback(true)
        }
      }).catch(()=>{
        this.selectList.aisles = []
        this.selectList.rows = []
        this.form.Aisleid = null
        this.form.Rowno = null
        callback && callback(false)
      })
    },
    getSelectListRows(callback){
      let params = {Areaid:this.form.Areaid,Aisleid:this.form.Aisleid}
      GetPalceRowno(params).then((d)=>{
        this.selectList.rows = d.data || [];
        if (this.selectList.rows.length===1) {
          this.form.Rowno = this.selectList.rows[0]
          callback && callback(true)
        } else {
          this.form.Rowno = null
          callback && callback(true)
        }
      }).catch(()=>{
        this.selectList.rows = []
        this.form.Rowno = null
        callback && callback(false)
      })
    },
    onAreaChange() {
      this.$emit('update:loading',true)
      this.getSelectListAisles(()=>{
         this.$emit('update:loading',false)
      })
    },
    onAisleChange() {
      this.$emit('update:loading',true)
      this.getSelectListRows(()=>{
         this.$emit('update:loading',false)
      })
    },
    onSearch(){
      if (!this.form.Areaid) {
        this.$error({
          title: '系统提示',
          content: '请选择库区！',
        });
        return false;
      }
      this.$emit('search',{...this.form})
    }
  }
}
</script>

<style lang="less" scoped>
.slect-width{
  width:180px
}
</style>